import React from 'react';
import { Tabs } from 'antd';
import StrategyLog from './strategyLog';
const { TabPane } = Tabs;

export default function challengeLog(props) {
  const { nodes, challenge_node_log, variables, actions, using_variables, variable } = props;

  const current = challenge_node_log ? nodes.find((it) => it.id === challenge_node_log.id) : nodes[0];
  return (
    <Tabs defaultActiveKey={current.id}>
      {nodes.map((node) => {
        const logs =
          challenge_node_log && challenge_node_log.id === node.id
            ? {
                rules: challenge_node_log.strategy_log.rules,
                variables: variables || [],
              }
            : {};
        return (
          <TabPane tab={node.name} key={node.id}>
            <StrategyLog
              logs={logs}
              actions={actions}
              strategy_id={node.strategy_id}
              version={node.version}
              using_variables={using_variables}
              name={node.name}
              close={() => props.close()}
              variable={variable}
            />
          </TabPane>
        );
      })}
    </Tabs>
  );
}
